import 'package:flutter/material.dart';
import 'package:flutter_swiper/flutter_swiper.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';

class HomePage extends StatefulWidget {
  const HomePage({Key? key}) : super(key: key);
  @override
  _HomePageState createState() => _HomePageState();
}

//轮播图
Widget _swiperWidget() {
  List<Map> imgList = [
    {"url": "https://www.itying.com/images/flutter/slide01.jpg"},
    {"url": "https://www.itying.com/images/flutter/slide02.jpg"},
    {"url": "https://www.itying.com/images/flutter/slide03.jpg"},
    {"url": "https://www.itying.com/images/flutter/slide02.jpg"},
  ];

  return Container(
    child: AspectRatio(//可适配到左右的终端
      aspectRatio: 2 / 1,
      child: Swiper(
        onTap: null,
          scale: 0.95,
          pagination: SwiperPagination(// 分页指示器
              alignment: Alignment.bottomCenter,// 位置 Alignment.bottomCenter 底部中间
              margin: const EdgeInsets.fromLTRB(0, 0, 0, 5),// 距离调整
              builder: DotSwiperPaginationBuilder( // 指示器构建
                  space: 5.h,// 点之间的间隔
                  size: 10.sp, // 没选中时的大小
                 color: Colors.black54,// 没选中时的颜色
                  activeColor: Colors.white)),
          control: new SwiperControl(color: Colors.white),
          itemBuilder: (BuildContext context, int index) {
            return new Image.network(
              imgList[index]["url"],
              fit: BoxFit.fill,
            );
          },
          itemCount: imgList.length,
          autoplay: true),
    ),
  );
}

Widget _titleWidget(value) {
  return
    Container(
    height: 32.h,
    margin: EdgeInsets.only(left: 20.h),
    padding: EdgeInsets.only(left: 20.h),
    decoration: BoxDecoration(
        border: Border(
            left: BorderSide(
      color: Colors.red,
      width: 10.w,
    ))),
    child: Text(
      value,
      style: TextStyle(color: Colors.black54,fontSize: 20.sp),
    ),
  );
}

//猜你喜欢模块
Widget _likeListWidget() {
  return Container(
    height: 234.h,
    padding: EdgeInsets.all(20.h),
    child: ListView.builder(
      scrollDirection: Axis.horizontal,
      itemBuilder: (contxt, index) {
        return Column(
          children: <Widget>[
            Container(
              height: 140.h,
              width: 140.w,
              margin: EdgeInsets.only(right: 21.h),
              child: Image.network(
                  "https://www.itying.com/images/flutter/hot${index + 1}.jpg",
                  fit: BoxFit.cover),
            ),
            Container(
              padding: EdgeInsets.only(top: 10.h),
              height: 44.h,
              child: Text("第${index}条"),
            )
          ],
        );
      },
      itemCount: 10,
    ),
  );
}

class _HomePageState extends State<HomePage>
    with AutomaticKeepAliveClientMixin {
  @override
  void initState() {
    super.initState();
    _getFocusData();
  }

  _getFocusData() async {
    var api = 'http://jd.itying.com/api/focus';
    setState(() {
    });
  }

  @override
  Widget build(BuildContext context) {
    return MediaQuery(
        data: MediaQuery.of(context).copyWith(textScaleFactor: 1.0),
      child:Scaffold(
      appBar: AppBar(
        leading: IconButton(
          icon: Icon(Icons.center_focus_weak, size: 28, color: Colors.black87),
          onPressed: null,
        ),
        title: InkWell(
          child: Container(
            height: 68.h,
            decoration: BoxDecoration(
                color: Color.fromRGBO(233, 233, 233, 0.8),
                borderRadius: BorderRadius.circular(30)),
            padding: EdgeInsets.only(left: 10),
            child: Row(
              crossAxisAlignment: CrossAxisAlignment.center,
              children: <Widget>[
                Icon(Icons.search),
                Text("笔记本", style: TextStyle(fontSize: 18.sp))
              ],
            ),
          ),
          onTap: () {
            Navigator.pushNamed(context, '/search');
          },
        ),
        actions: <Widget>[
          IconButton(
            icon: Icon(Icons.message, size: 28, color: Colors.black87),
            onPressed: null,
          )
        ],
      ),
      body: ListView(
        children: <Widget>[
          _swiperWidget(),
          SizedBox(height: 10),
          _titleWidget("猜你喜欢"),
          _likeListWidget(),
          SizedBox(height: 10),
          InkWell(
              onTap: () {
                Navigator.pushNamed(context, '/productContent',
                    arguments: {"id": 1});
              },
              child: Container(
                child: _titleWidget("热门推荐"),
              ))
        ],
      ),
    ));
  }

  @override
  // TODO: implement wantKeepAlive
  bool get wantKeepAlive => true;
}
